<template>
  <el-tree
  :props="props"
  :load="loadNode"
  @node-click="nodeclick"
  lazy>
</el-tree>
</template>

<script>
export default {
    data() {
        return {
        props: {
            label: 'name',
            children: 'zones',
            isLeaf: 'leaf'
        },
        };
    },
    methods: {
        nodeclick(data,node){
            console.log('--------',node);
            console.log('--------',data);
            this.$emit('selectCategory',data);
        },
        async loadNode(node, resolve) {
            if (node.level === 0) {
                let result= await this.getGoodsCategory(1);
                return resolve(result);

            }else if (node.level === 1) {
                let result=await this.getGoodsCategory(node.data.cid);
                return resolve(result);
            }else{
                return resolve([]);
            }

        },
        async getGoodsCategory(type){
            let res=await this.$api.getGoodsCategory({type});
            return res.data.result;

        }
    }
};
</script>

<style lang="less" scoped>
    .el-tree{
        background-color: transparent;
        color: #333;
    }
</style>